.index {
    color: #fff;

    @color: #353535;

    .notice {
        height: 40px;
        padding: 16px 0;
        line-height: 40px;
        font-size: 32px;
        color: #E64340;

        i {
            width: 40px;
            height: 40px;
            float: left;
            margin: 0 22px 0 32px;
            background: url("../../assets/images/index/warning.png") no-repeat;
            background-size: cover;
        }
    }

    .header {
        height: 650px;
        background: url("../../assets/images/index/index-bg.png") no-repeat;
        background-size: 1080px 427px;

        .header-top {
            padding: 42px 32px 23px;

            .setting {
                width: 60px;
                height: 60px;
                background: url("../../assets/images/index/icon-set.png") no-repeat center;
                background-size: 60px;
                text-indent: -9999em;
                overflow: hidden;
            }
        }

        .summary {
            height: 530px!important;

            .items {
                display: flex;
                flex-direction: row;
                flex-wrap: wrap;
                align-content: space-between;
                justify-content: space-between;
                height: 503px;
                padding: 52px 82px 65px;
                background: url("../../assets/images/index/index-swiper.png") no-repeat center;
                background-size: cover;
                box-sizing: border-box;
                color: @color;

                dl, dt, dd {
                    margin: 0;
                    padding: 0;
                }

                dl {
                    display: flex;
                    flex-direction: column;
                    width: 50%;
                }

                &.first {
                    dl {
                        height: 134px;
                        justify-content: space-between;
                    }

                    dl:nth-child(2n) {
                        text-align: right;
                    }

                    dl:nth-child(3), dl:nth-child(4) {
                        height: 122px;
                        flex-flow: column-reverse;

                        dd {
                            color: #000;
                            font-size: 42px;
                        }
                    }

                    dt {
                        color: #888;
                        font-size: 36px;
                    }

                    dd {
                        color: #e64340;
                        font-size: 60px;
                    }
                }

                &.second {
                    dl {
                        justify-content: space-between;
                        height: 90px;
                        padding-left: 130px;
                        box-sizing: border-box;
                        background-position: left center;
                        background-repeat: no-repeat;
                        background-size: 90px;

                        &.guzhang {
                            background-image: url("../../assets/images/index/icon-guzhang.png");
                        }
                        &.yichang {
                            background-image: url("../../assets/images/index/icon-network.png");
                        }
                        &.jingbao {
                            background-image: url("../../assets/images/index/icon-money.png");
                        }
                        &.buhuo {
                            background-image: url("../../assets/images/index/icon-jianyi.png");
                        }

                        dd {
                            color: #888;

                            strong {
                                margin-right: 15px;
                                color: @color;
                            }
                        }

                        &:nth-child(2n) {
                            width: 270px;
                        }
                    }
                }
            }

            .am-carousel-wrap {
                .am-carousel-wrap-dot {
                    span {
                        width: 24px;
                        height: 24px;
                    }
                }

                .am-carousel-wrap-dot-active > span {
                    background-color: @color;
                }
            }
        }
    }

    .quickLink {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        margin-top: 55px;
        color: @color;

        .item {
            display: flex;
            flex-direction: column;
            align-items: center;
            width: 25%;
            padding: 0 10px;
            margin-bottom: 80px;
            box-sizing: border-box;

            i {
                display: block;
                width: 90px;
                height: 90px;
                background-repeat: no-repeat;
                background-position: center;

                &.device {
                    background-image: url("../../assets/images/index/icon-device.png");
                    background-size: 74px 90px;
                }
                &.yunying {
                    background-image: url("../../assets/images/index/icon-operate.png");
                    background-size: 89px 90px;
                }
                &.product {
                    background-image: url("../../assets/images/index/icon-product.png");
                    background-size: 85px 90px;
                }
                &.order {
                    background-image: url("../../assets/images/index/icon-order.png");
                    background-size: 70px 90px;
                }
                &.caiwu {
                    background-image: url("../../assets/images/index/icon-caiwu.png");
                    background-size: 90px 74px;
                }
                &.data {
                    background-image: url("../../assets/images/index/icon-data.png");
                    background-size: 83px 90px;
                }
                &.group {
                    background-image: url("../../assets/images/index/icon-group.png");
                    background-size: 90px 88px;
                }
                &.buhuo {
                    background-image: url("../../assets/images/index/icon-buhuo.png");
                    background-size: 82px 90px;
                }
                &.status {
                    background-image: url("../../assets/images/index/icon-status.png");
                    background-size: 87px 90px;
                }
                &.gongdan {
                    background-image: url("../../assets/images/index/icon-gongdan.png");
                    background-size: 90px 90px;
                }
            }
            .name {
                margin-top: 32px;
                color: @color;
                font-size: 40px;
            }
        }
    }
}
